﻿$(function () {

    //表单验证器的初始化
    $('#userAddForm').bootstrapValidator({
        excluded:[":disabled"],
        feedbackIcons: {  //显示表单验证结果的图标
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            name: {
                validators: {
                    notEmpty: {
                        message: '用户名不能为空！'
                    },  stringLength: {
                        min: 1,
                        max: 6,
                        message: '用户名长度不能小于1位或超过6位！'
                    }}}
                    ,
                    pass: {
                        validators: {
                            notEmpty: {
                                message: '密码不能为空！'
                            },
                            stringLength: {
                                min: 1,
                                max: 6,
                                message: '密码长度不能小于1位或超过6位！'
                            }
                        }
                    },beizhu: {
                        validators: {
                            notEmpty: {
                                message: '备注不能为空！'
                            },
                            stringLength: {
                                min: 4,
                                max: 20,
                                message: '用户备注不能小于4位或超过20位！'
                            }
                        }
                    },
            orgNames: {
                validators: {
                    notEmpty: {
                        message: '部门不能为空！'
                    }
                }
            }
            }
    });

});
var columns = [
    {
        title: '姓名',
        dataIndex:'name',
        align:'center',
        sorter:(a, b) => a.name.localeCompare(b.name),
        width: '10%'
    }, {
        title: '密码',
        dataIndex:'pass',
        align:'center',
        width: '10%'
    }, {
        title: '所属角色',
        dataIndex:'roleNames',
        align:'center',
        width: '10%'
    }, {
        title: '所属部门',
        dataIndex:'orgNames',
        align:'center',
        width: '10%'
    }, {
        title: '职务',
        dataIndex:'postNames',
        align:'center',
        width: '10%'
    }, {
        title: '备注',
        dataIndex:'beizhu',
        align:'center',
        width: '10%'
    }, {
        title: '上次活动时间',
        dataIndex:'time',
        width: '20%'
    }, {
        title: '操作',
        dataIndex:'',
        align:'center',
        scopedSlots: { customRender: 'action'},
        width: '30%'
    }
];
//分页设置
var pagination = {
    showSizeChanger: true,//每页显示多少条记录是否需要?
    showQuickJumper:true,//跳到第几页要不要？
    pageSizeOptions:['5', '10', '15'],
    pageSize:5,//每页的数据条数
    current: 1,//当前页
    position:'bottom',//top,both,bottom，显示的位置
    total: 0,//数据的总条数
    onChange: (current) => { // 切换分页时的回调，
        // 当在页面定义change事件时，切记要把此处的事件清除，因为这两个事件重叠了，可能到时候会导致一些莫名的bug
        this.pagination.current = current;
    }
};
var v = new Vue({
    el:'#app',
    data () {
        return {
            info: null,
            id:null,
            name:'',
            pass:'',
            beizhu:'',
            time:'',
            modalTitle:'',
            key:'save',
            columns:columns,
            dataSources:null,
            pagination:pagination,
            selectedRowKeys:[],
            selectedRows:[],
            orgids:[],
            treeData:[],
            roleids:[],
            roletreeData:[],
            postids:[],
            posttreeData:[]

        }
    },
    methods:{
        //加载树形选择
        loadTreeData(){
            axios({
                url:'org/getAllTreeData.do',
                method:'post'

            }).then(function (res) {
                v.treeData = res.data;
            }).catch(function (reason) {
            });
        },

        //加载树形选择
        loadRoleTreeData(){
            axios({
                url:'role/getAllRoleTreeData.do',
                method:'post'

            }).then(function (res) {
                v.roletreeData = res.data;
            }).catch(function (reason) {
            });
        },
        //加载树形选择
        loadPostTreeData(){
            axios({
                url:'post/getAllPostTreeData.do',
                method:'post'

            }).then(function (res) {
                v.posttreeData = res.data;
            }).catch(function (reason) {
            });
        },
        orgTreeChange(){

        },
        //批量删除
        deleteDatas(){
            //处理selectedRowKeys数组[2,12,33]
            //ids=2&ids=12&ids=33
            var da = {ids: this.selectedRowKeys};
            axios({
                url:'user/deleteDatas.do',
                method:'post',
                data:Qs.stringify(da, {arrayFormat: 'repeat'})

            }).then(function (res) {
                if(res.data.result=='success'){
                    alert('删除成功！');
                    //刷新数据
                    v.loadData();
                }else{
                    alert('删除失败！');
                }

            }).catch(function (reason) {

            });

        },
        //自定义行
        customRow(record, index){
            return{
                style:{
                    'background-color':'#ffffff'
                },
                on:{
                    click: (event) => {
                        if(this.selectedRowKeys.length>0 && this.selectedRowKeys.includes(record.id)){
                            this.selectedRowKeys.splice(this.selectedRowKeys.indexOf(record.id),1);
                        }else
                        {
                            this.selectedRowKeys.push(record.id);
                        }
                    }
                }
            }
        },
        //行选中事件
        onSelectChange(selectedRowKeys,selectedRows){
            this.selectedRowKeys = selectedRowKeys;
            this.selectedRows = selectedRows;
        },
        //提交操作
        operate(){
            //触发表单验证
            $('#userAddForm').data('bootstrapValidator').validate();//验证
            var tag = $('#userAddForm').data('bootstrapValidator').isValid();//验证状态true或false
            if(tag){

                if(this.key=='save'){
                    this.saveData();
                } else{
                    this.updateData();
                }
            }
        },
        //打开添加对话框
        openAdd(){
            //重置验证
            $('#userAddForm').data("bootstrapValidator").resetForm();

            this.clearData();
            $('#myModal').modal('show');
            this.modalTitle = '用户添加';
            this.key = 'save';
            this.loadTreeData();
            this.loadRoleTreeData();
            this.loadPostTreeData();

        },
        //打开修改对话框
        openUpdate(item){
            this.clearData();
            //重置验证
            $('#userAddForm').data("bootstrapValidator").resetForm();
            $('#myModal').modal('show');
            this.modalTitle = '用户修改';
            this.name = item.name;
            this.pass = item.pass;
            this.beizhu = item.beizhu;
            this.id = item.id;
            this.orgids=item.sorgids.split(",");
            this.roleids=item.sroleids.split(",");
            this.postids=item.spostids.split(",");
            //模态框显示数据
            this.key = 'update';
            this.loadTreeData();
            this.loadRoleTreeData();
            this.loadPostTreeData();
        },
        //加载数据
        loadData(){
            axios({
                url:'user/getAllData.do',
                method:'post'

            }).then(function (res) {
                v.dataSources = res.data;
            }).catch(function (reason) {
                alert('请求失败')
            });
        },
        clearData(){
            this.name = '';
            this.pass = '';
            this.beizhu = '';
            this.orgids = [];
            this.roleids = [];
            this.postids = [];
        },
        //查询用户
        selectData(){
            axios({
                url:'user/selectData.do',
                method:'post',
                data:{name:this.name}

            }).then(function (res) {
                v.dataSources = res.data;
            }).catch(function (reason) {
                alert('请求失败')
            });

        },
        //删除用户
        deleteData(id){
            axios({
                url:'user/deleteData.do',
                method:'post',
                data:{
                    id:id
                }

            }).then(function (res) {
                if(res.data.result=='success'){
                    alert('删除成功！');
                    //刷新数据
                    v.loadData();
                }else{
                    alert('删除失败！');
                }

            }).catch(function (reason) {

            });
        },
        //修改用户
        updateData(){
            axios({
                url:'user/updateData.do',
                method:'post',
                data:{
                    name:this.name,
                    pass:this.pass,
                    beizhu:this.beizhu,
                    id:this.id,
                    orgids:this.orgids,
                    roleids:this.roleids,
                    postids:this.postids
                }

            }).then(function (res) {
                if(res.data.result=='success'){
                    alert('修改成功！');
                    //关闭模态框
                    $('#myModal').modal('hide');
                    v.clearData();
                    //刷新数据
                    v.loadData();
                }else{
                    alert('修改失败！');
                }

            }).catch(function (reason) {

            });
        },
        //保存用户
        saveData(){
            axios({
                url:'user/saveData.do',
                method:'post',
                data:{
                    name:this.name,
                    pass:this.pass,
                    beizhu:this.beizhu,
                    orgids:this.orgids,
                    roleids:this.roleids,
                    postids:this.postids
                }

            }).then(function (res) {
                if(res.data.result=='success'){
                    alert('保存成功！');
                    //关闭模态框
                    $('#myModal').modal('hide');
                    v.clearData();
                    //刷新数据
                    v.loadData();
                }else{
                    alert('保存失败！');
                }

            }).catch(function (reason) {

            });
        }

    },
    mounted () {
        this.loadData();
    }

});